<extend name="Public:base" />
<block name="appendheader">
	<!-- 数据模型显示JS -->
    <script src="../Public/echarts_map/build/dist/echarts.js"></script>
    <script src="../Public/echarts_map/geoJson/china-main-city/china-main-city-map.js"></script>
	<script type="text/javascript">
		$(function() {
			if('{$Think.session.user_name}' == 'admin') {
				$("#WebMenu-1000").addClass('active');	//选中父菜单
			} else {
				$("#WebMenu-2000").addClass('active');	//选中父菜单
			}	
		});
	</script>
</block>
<block name="breadcrumb">
	<div class="page-header pull-left">
		<div class="page-title"><i class="icon fa fa-home"></i> {$Think.config.SITENAME}</div>
	</div>
</block>
<block name="main_content">
	<div class="row">
		<div class="col-md-12">
			<div class="portlet box">
				<div class="portlet-body">
					<div class="row">
						<div style="padding-left:1%;padding-right:1%; background-color:#FFFFFF;">
							<div id="main" style="width:98%; height:700px;"></div>
	                     </div>
					</div>
			 	</div>
			</div>
		</div>
	</div>
    <script type="text/javascript">
        require.config({
            paths: {
                echarts: '../Public/echarts_map/build/dist'
            }
        });
		// 使用
        require(
            [
                'echarts',
				'echarts/chart/map'
            ],
            function (ec) {
				// --- 地图 ---
				var myChart = ec.init(document.getElementById('main'));

				var level =0;
				var curIndx = 0;
				var mapType = [
					'china',
					// 23个省
					'广东', '青海', '四川', '海南', '陕西', 
					'甘肃', '云南', '湖南', '湖北', '黑龙江',
					'贵州', '山东', '江西', '河南', '河北',
					'山西', '安徽', '福建', '浙江', '江苏', 
					'吉林', '辽宁', '台湾',
					// 5个自治区
					'新疆', '广西', '宁夏', '内蒙古', '西藏', 
					// 4个直辖市
					'北京', '天津', '上海', '重庆',
					// 2个特别行政区
					'香港', '澳门'
				];
				var mapGeoData = require('echarts/util/mapData/params');
				for (var city in cityMap) {
					mapType.push(city);
					// 自定义扩展图表类型
					mapGeoData.params[city] = {
						getGeoJson: (function (c) {
							var geoJsonName = cityMap[c];
							return function (callback) {
								$.getJSON('../Public/echarts_map/geoJson/china-main-city/' + geoJsonName + '.json', callback);
							}
						})(city)
					}
				}
				
				var ecConfig = require('echarts/config');
				var zrEvent = require('zrender/tool/event');
			
				myChart.on(ecConfig.EVENT.MAP_SELECTED, function (param){
					
					//curIndx++;
//					var mt = mapType[curIndx % mapType.length];
//					option.series[0].mapType = mt;
//					option.title.subtext = mt + ' （滚轮或点击切换）';
//					myChart.setOption(option, true);
					
					if(param.target == '南丰县') {
						//console.log(param);
						window.location.href = "?g=Admin&m=AnalysisQuota&a=first_quota&area_code=361023";
					}
					
					var len = mapType.length;
					var mt = mapType[curIndx % len];
					var dl;
					
					if(level!==2){
					if (mt == 'china') {
						// 全国选择时指定到选中的省份
						var selected = param.selected;
						//console.log(selected);
						for (var i in selected) {
							if (selected[i]) {
								mt = i;
								while (len--) {
									if (mapType[len] == mt) {
										curIndx = len;
									}
								}
								break;
							}
						}
						level=1;
						//option.tooltip.formatter = '{b}';
					}
					else {
						if(level==1)
						{
							var selected = param.selected;
							//console.log(selected);
							for (var i in selected) {
								if(selected[i])
								{
									mt=i;
								}
							}
							level=2;	
						}
						
						//curIndx = 0;
						//mt = 'china';
						//option.tooltip.formatter = '滚轮切换或点击进入该省<br/>{b}';
					}
					
					option.series[0].mapType = mt;
					//option.tooltip.formatter = '{b}<br>'+option.series[0].data[0];
					option.title.subtext = mt;
					}
					else{
						level=2;
					}
								
					myChart.setOption(option, true);
				});
				option = {
					title: {
						text : '全国地图',
						subtext : '全国'
					},
					dataRange: { //值域选择
					    min: 5000,
						max: 18000,
						calculable: false,
						show: false,
						color: ['#ff3333', 'orange', 'yellow', 'lime', 'aqua']
					},
					tooltip : {
						trigger: 'item',
						formatter: function (param){
								//console.log(param)
								//return param[1];
								var selected = param.selected;
								//console.log(selected);
								var is_repeat = 0;
								var ls = 0;
								for (var j in option.series[0].data) {
									if(option.series[0].data[j].name == param[1]) {
										ls =j;
										is_repeat=1;
										//console.log(option.tooltip.formatter);
									}
								}
								//console.log(is_repeat);
								if(is_repeat == 0) {
									return param[1];
								} else {
									return param[1]+'<br/>'+option.series[0].data[ls].value;
								}
							},
					},
					series : [
						{
							name: '全国344个主要城市（县）地图',
							link: 'http://www.nwnu.edu.cn',
							type: 'map',
							mapType: 'china',
							selectedMode : 'single', //multiple
							itemStyle:{
								normal: {        //地图样式
									borderColor: '#CFCFCF', //地图边界颜色
									color: '#7CB5EC',  //地图颜色
									label: {
										show: true,
										textStyle: {
											color: '#fd631e' //字体颜色
										},
									}
								},//normal:{label:{show:true}},
								emphasis:{label:{show:true}}
							},
							data:[
								{name: '南丰县',value: "教师问卷数量：1177<br/>学生问卷数量：1715", selected:true},
								{name: '江西',value: 10660},
								{name: '甘肃',value: 5271},
								{name: '浙江',value: 9234},
								{name: '云南',value: 23085},
								{name: '湖北',value: 13166}
							]
						}
					]
				};
				myChart.setOption(option, true);
			}
        );
    </script>
</block>